<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>产量统计表</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="${pageContext.request.contextPath }/assets/css/layui.css"  media="all">
	<link rel="stylesheet" href="${pageContext.request.contextPath }/assets/css/toastr.min.css"  media="all">
</head>
<body>
<div class="demoTable" style="padding:10px 0 0 15px">
    <div class="layui-inline">
        <input class="layui-input" name="time" id="time" autocomplete="off" placeholder="请选择时间">
    </div>
    <button class="layui-btn layui-btn-blue" style="margin: 0 0 0 10px" data-type="reload"><i class="layui-icon layui-icon-search">  查询</i></button>
</div>
<table class="layui-hide" id="test" lay-filter="test"></table>
<div class="layui-tab layui-tab-card" style="display: none;" id="plDetail">
	<ul class="layui-tab-title">
		<li class="layui-this">0960外压组件产量统计</li>
		<li>1080组件产量统计</li>
		<li>1060组件产量统计</li>
		<li>0980外压组件产量统计</li>
	</ul>
	<div class="layui-tab-content">
		<div class="layui-tab-item layui-show">
			<table class="layui-hide" id="plDetail1" lay-filter="plDetail1"></table>
		</div>
		<div class="layui-tab-item">
			<table class="layui-hide" id="plDetail2" lay-filter="plDetail2"></table>
		</div>
		<div class="layui-tab-item">
			<table class="layui-hide" id="plDetail3" lay-filter="plDetail3"></table>
		</div>
		<div class="layui-tab-item">
			<table class="layui-hide" id="plDetail4" lay-filter="plDetail4"></table>
		</div>
	</div>
</div>
 
<script type="text/html" id="toolbarDemo">
	<div class="layui-btn-container">
	</div>
</script>
              
          
<script src="${pageContext.request.contextPath }/assets/layui.js" charset="utf-8"></script>
<script src="${pageContext.request.contextPath }/assets/layui.all.js"></script>
<script src="${pageContext.request.contextPath }/assets/js/jquery.min.js" charset="utf-8"></script>
<script src="${pageContext.request.contextPath }/assets/js/toastr.min.js" charset="utf-8"></script>
<jsp:include page="ScriptInc.jsp"></jsp:include>
<script>
layui.use(['table','layer','upload','form'], function(){
	var table = layui.table;
	var layer = layui.layer,
    form = layui.form;
	var laydate = layui.laydate;
	//执行一个laydate实例
	laydate.render({
		elem: '#time' //指定元素
		,type: 'month'
	});
	var $ = layui.jquery, active = {
			reload:function () {
				var time = $("#time").val();
				console.log(time)
				if (time == '') {
					toastr.warning("请选择日期！");
	        		return false;
				}
				var detail = document.getElementById('plDetail');
				detail.style.display = 'none';
				table.reload('contenttable',{
					method:'get',
					where:{time: time}
				});
			}
		}
	$('.layui-btn').on('click', function(){
        var type = $(this).data('type');
        active[type] ? active[type].call(this) : '';
    });
	table.render({
	    elem: '#test'
	    ,url:'${pageContext.request.contextPath }/reportMana/selectOutputByTime.do'
	    ,toolbar: '#toolbarDemo'
	    ,title: '产量统计数据表'
	    ,id :'contenttable'
	    ,limits:[10,20,30]
	    ,cols: [[
	      {field:'years', title:'年份', style:'text-align: center;', align: 'center', templet: function(d){
		          return d.years+'年';
  	      }}
	      ,{field:'yearOutput', title:'年累计产量', style:'text-align: center;', align: 'center'}
	      ,{field:'month', title:'月份', style:'text-align: center;', align: 'center', templet: function(d){
		          return d.month+'月';
  	      }}
	      ,{field:'monthOutput', title:'月累计产量', style:'text-align: center;', align: 'center'}
	    ]]
	    ,page: false
	});
	
	//监听行单击事件
	table.on('row(test)', function(obj){
		var detail = document.getElementById('plDetail');
		detail.style.display = '';
		var years = obj.data.years;
		var month = obj.data.month;
		var time = years + '-' + month;
		table.render({
		    elem: '#plDetail1'
		    ,url:'${pageContext.request.contextPath }/reportMana/listAllPLDetail.do'
		    //,toolbar: '#toolbarDemo'
		    ,title: '0960产量统计数据表'
		    ,id :'contentDetialTable1'
		    ,where:{time: time, pnum: 'PSH2-0960-T-01'}
		    ,limits:[10,20,30]
		    ,cols: [[
		      {type: 'numbers', title:'序号', fixed: 'left', width:'5%', unresize: true, sort: true}
		      ,{field:'pDate', title:'日期', style:'text-align: center;', align: 'center'}
		      ,{field:'adOutput', title:'实际日产量', style:'text-align: center;', align: 'center'}
		      ,{field:'pdOutput', title:'计划日产量', style:'text-align: center;', align: 'center'}
		      ,{field:'dRate', title:'偏差率', style:'text-align: center;', align: 'center'}
		    ]]
		    ,page: false
		});
		table.render({
		    elem: '#plDetail2'
		    ,url:'${pageContext.request.contextPath }/reportMana/listAllPLDetail.do'
		    //,toolbar: '#toolbarDemo'
		    ,title: '1080产量统计数据表'
		    ,id :'contentDetialTable2'
		    ,where:{time: time, pnum: 'PSH1-1080-C-04'}
		    ,limits:[10,20,30]
		    ,cols: [[
		      {type: 'numbers', title:'序号', fixed: 'left', width:'5%', unresize: true, sort: true}
		      ,{field:'pDate', title:'日期', style:'text-align: center;', align: 'center'}
		      ,{field:'adOutput', title:'实际日产量', style:'text-align: center;', align: 'center'}
		      ,{field:'pdOutput', title:'计划日产量', style:'text-align: center;', align: 'center'}
		      ,{field:'dRate', title:'偏差率', style:'text-align: center;', align: 'center'}
		    ]]
		    ,page: false
		});
		table.render({
		    elem: '#plDetail3'
		    ,url:'${pageContext.request.contextPath }/reportMana/listAllPLDetail.do'
		    //,toolbar: '#toolbarDemo'
		    ,title: '1060产量统计数据表'
		    ,id :'contentDetialTable3'
		    ,where:{time: time, pnum: 'PSH1-1060-B-03'}
		    ,limits:[10,20,30]
		    ,cols: [[
		      {type: 'numbers', title:'序号', fixed: 'left', width:'5%', unresize: true, sort: true}
		      ,{field:'pDate', title:'日期', style:'text-align: center;', align: 'center'}
		      ,{field:'adOutput', title:'实际日产量', style:'text-align: center;', align: 'center'}
		      ,{field:'pdOutput', title:'计划日产量', style:'text-align: center;', align: 'center'}
		      ,{field:'dRate', title:'偏差率', style:'text-align: center;', align: 'center'}
		    ]]
		    ,page: false
		});
		table.render({
		    elem: '#plDetail4'
		    ,url:'${pageContext.request.contextPath }/reportMana/listAllPLDetail.do'
		    //,toolbar: '#toolbarDemo'
		    ,title: '0980产量统计数据表'
		    ,id :'contentDetialTable4'
		    ,where:{time: time, pnum: 'PSH2-0980-T-02'}
		    ,limits:[10,20,30]
		    ,cols: [[
		      {type: 'numbers', title:'序号', fixed: 'left', width:'5%', unresize: true, sort: true}
		      ,{field:'pDate', title:'日期', style:'text-align: center;', align: 'center'}
		      ,{field:'adOutput', title:'实际日产量', style:'text-align: center;', align: 'center'}
		      ,{field:'pdOutput', title:'计划日产量', style:'text-align: center;', align: 'center'}
		      ,{field:'dRate', title:'偏差率', style:'text-align: center;', align: 'center'}
		    ]]
		    ,page: false
		});
	});
  
});

toastr.options.positionClass = 'toast-top-center'; //提示框的位置设置为中上
</script>

</body>
</html>